<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <form action="zuoye2.html"  method="post" onsubmit="return ">
    用户名: <input type="text" id="name" value=""><span id="names" onblur="a()"></span><br>
    密码:  <input type="password" id="pwd1" value=""><span id="pwds"></span>
    </form>
    <script type="text/javascript">
        function a() {

                if (document.getElementById("name").value.length < 6) {
                    document.getElementById("names").innerHTML = "用户名太短"
                    return false;
                }
                document.getElementById("names").innerHTML = "用户名可以使用"
                return true;

        }
        function b() {
            document.getElementsById("pwd").onblur = function () {
                if (document.getElementById("pwd").value==isNaN()) {
                    document.getElementById("pwds").innerHTML = "密码不能为全数字"
                    return false;
                }
                document.getElementById("pwds").innerHTML = "密码可以使用"
                return true;
            }
        }
    </script>
</body>
<body>
<%-- onsubmit事件在调用js函数时，需要添加return关键字 --%>
<form action="index.jsp" onsubmit="return checkForm()">
    用户名：<input type="text" id="username" name="user.name" onblur="checkUsername()"/><span id="nameMsg"></span>
    <br/>
    密码：<input type="password" id="pwd" name="user.pwd" onblur="checkPwd()"/><span id="pwdMsg"></span>
    <br/>
    <input type="submit"/>
</form>
<script type="text/javascript">
    function checkForm(){
        //该方法里面如果返回是true,表单就会提交，否则表单就不提交
        return checkUsername()&&checkPwd();
    }

    function checkUsername(){
        var nameObj=document.getElementById("username");
        var username=nameObj.value;
        if(username.length<6){
            document.getElementById("nameMsg").innerHTML="用户名长度太短";
            //给出相应的颜色
            document.getElementById("nameMsg").style="color:red";
            return false;
        }else{
            document.getElementById("nameMsg").innerHTML="验证通过";
            document.getElementById("nameMsg").style="color:green";
            return true;
        }
    }

    function checkPwd(){
        var pwdObj=document.getElementById("pwd");
        var pwd=pwdObj.value;
        if(isNaN(pwd)){
            document.getElementById("pwdMsg").innerHTML="验证通过";
            document.getElementById("pwdMsg").style="color:green";
            return true;
        }else{
            document.getElementById("pwdMsg").innerHTML="密码不能是纯数字";
            document.getElementById("pwdMsg").style="color:red";
            return false;
        }
    }
</script>
</body>
</html>